<template>
  <div>
    <h1>vue2中的provide和inject</h1>
    <br/>
    <el-input v-model="msg"></el-input>
    <div>{{ msg }}</div>
    <div>{{ obj }} </div>
    <div>{{ arr }} </div>
    <br/>
    <br/>
    <br/>
    <son></son>
  </div>
</template>

<script>
import son from '../components/provideAndInject/son.vue'

export default {
  name: "provideAndInject",
  components: {son},
  provide() {
    return {
      someMsg: this.msg,
      asyncMsg: (...args) => args.length ? this.msg = args[0] : this.msg,
      asyncObj: this.obj,
      asyncArr: this.arr
    }
  },
  data() {
    return {
      msg: 'someMsg',
      obj: {
        name: '张三',
        age: 23
      },
      arr: [1, 2, 3]
    }
  }
}
</script>

<style scoped>
</style>
